<template>
  <div style="height:100%" id="query">
    <view-box ref="viewBox">
      <Myheader v-if='pageType=="baoming"' id='type_baoming' :page="page"></Myheader>

      <div style="height:50px;" v-if='pageType!="baoming"'></div>

      <div v-if='pageType!="baoming"' style="width:100%">
        <x-header style="max-width: 850px;position: fixed;top: 0;width: 100%;z-index:1" slot="header" :left-options="{backText: ''}" title="报名查询">
          <a href="./#/racelist" style="font-size:24px" slot="right">
            <i class="fa fa-home fa-fw"></i>
          </a>
        </x-header>
      </div>

      <div class="index-topf">
        <h2>报名查询</h2>
        <group class="top-group">
          <x-input class="weui-vcode" v-model="indexNumber" :placeholder="$t('index.enter')" :is-type="isIdNumber">
          </x-input>
          <!-- <x-input placeholder="请填写验证码" v-model="code" class="weui-vcode">
          <x-button :disabled='clock' slot="right" type="primary" @click.native="countDown" mini>{{codeMessage}}
          </x-button>
        </x-input> -->

        </group>

        <div style="padding-left: 10px;padding-right: 10px;margin-top: 10px;margin-bottom: 10px">
          <!-- <x-button type="primary"  @click.native="more('click')">更多</x-button> -->
          <x-button type="primary" :disabled="buttonFlag" @click.native="search()">查询</x-button>
          <!-- <x-button type="primary" :disabled="buttonFlag" @click.native="indexBind('click')">查询</x-button> -->
        </div>

      </div>

      <div class="index-tops">
        
        <ShowMessage  v-show='indexList.length!=0' v-for='(item,index) in indexList' :index11='index' :key='index' :data1='item' :idnumber='indexNumber' :type='"user"' :userKey="item._key"></ShowMessage>
        <!-- <Signedlist v-show='indexList.length!=0' v-for='(item,index) in indexList' :index11='index' :key='index' :data1='item' :idnumber='indexNumber'></Signedlist> -->
        <!-- <h2>{{this.name}}</h2> -->
        <!-- <grid :cols="3" class="gridbox">

        <grid-item>
          <load-more :show-loading="false" tip="参赛号" background-color="#fbf9fe"></load-more>
          <span class="grid-center">{{this.bib}}</span>
        </grid-item>


        <grid-item @click.native="competingNo" v-model="ce">
          <load-more :show-loading="false" tip="状态" background-color="#fbf9fe"></load-more>
          <span class="grid-center">{{stateMessage}}</span>
        </grid-item>

        <grid-item @click.native="competitionEvents" v-model="ce">
          <load-more :show-loading="false" :tip="$t('index.project')" background-color="#fbf9fe"></load-more>
          <span class="grid-center">{{this.project}}</span>
        </grid-item>
      </grid> -->

        <!-- <div style="text-align:center">
        
        <x-button v-if='!!mysid' style="display:inline-block" class='cancel-button' type="primary" mini @click.native="ButtonCancel">继续查询
        </x-button>
        <x-button v-if='!mysid' style="display:inline-block" class='cancel-button' type="primary" mini @click.native="ButtonCancel">继续查询
        </x-button>
      </div> -->

      </div>

      <toast v-model="showPositionValue" type="text" :time="800" is-show-mask :text="this.wrongMsg" position="default" width="20em"></toast>
      <!-- <toast v-model="noOpenMessage" type="text" :time="1000" is-show-mask :text="$t('message.Noopen')" position="default"
  width="20em"></toast> -->
      <toast v-model="noOpenMessage" type="warn">{{$t('index.Noopen')}}</toast>

      <div style="display:none" class="index-bottom">
        <grid :cols="3" ref="gridBox">
          <!-- 立即报名 -->
          <grid-item :label=" $t('index.list')" @click.native="showNoOpen('我的报名')">
            <i slot="icon" class="fa fa-i fa-id-card-o "></i>
          </grid-item>

          <!-- 我的报名  -->
          <grid-item v-if="indexStatus==0" class="unactive1" @click.native="goRouter('message')" :label=" $t('index.apply')">
            <i slot="icon" class="fa fa-search unactive "></i>
          </grid-item>

          <grid-item v-if="indexStatus==1" @click.native="goRouter('message')" :label=" $t('index.apply')">
            <i slot="icon" class="fa fa-search"></i>
          </grid-item>

          <!-- 我的照片 -->
          <grid-item :label=" $t('index.photo')" @click.native="showNoOpen('我的照片')">
            <!-- <grid-item :link="{ path: './photo'}" :label=" $t('message.photo')"> -->
            <i slot="icon" v-if="tag" class="fa fa-file-photo-o fa-no"></i>
            <i slot="icon" v-if="!tag" class="fa fa-file-photo-o "></i>
          </grid-item>

          <!-- 成绩/证书 -->
          <!-- <grid-item :link="{ path: './credential'}" :label=" $t('message.certificate')"> -->
          <grid-item :label=" $t('index.certificate')" @click.native="showNoOpen('我的成绩')">
            <i slot="icon" v-if="tag" class="fa fa-id-badge fa-no"></i>
            <i slot="icon" v-if="!tag" class="fa fa-id-badge "></i>
          </grid-item>

          <!-- 报名规程 -->
          <!-- <grid-item :link="{ path: './subarea'}" :label=" $t('message.discipline')">
          <i slot="icon" v-if="!indexNumber" class="fa fa-book "></i>
          <i slot="icon" v-if="indexNumber" class="fa fa-book "></i>
        </grid-item>

        <grid-item v-if="indexNumber" @click.native="goRouter('message')"
                   :label=" $t('message.apply')">
          <i slot="icon" class="fa fa-search"></i>
        </grid-item> -->

          <!-- 退出报名 -->
          <!-- <grid-item @click="" :link="{ path: './refund'}" :label=" $t('message.exit')">
          <i slot="icon" v-if="!indexNumber" class="fa fa-quora "></i>
          <i slot="icon" v-if="indexNumber" class="fa fa-quora "></i>
        </grid-item> -->

          <!-- 竞赛规程 -->
          <grid-item :label=" $t('index.discipline')" @click.native="showNoOpen('竞赛规程')">
            <!-- <grid-item :link="{ path: './subarea'}" :label=" $t('message.discipline')"  @click.native="showNoOpen"> -->
            <i slot="icon" v-if="this.rule" class="fa fa-book fa-no "></i>
            <i slot="icon" v-if="!this.rule" class="fa fa-book "></i>
          </grid-item>
          <!-- 报名须知 -->
          <grid-item :label=" $t('index.notice')" @click.native="showNoOpen('报名须知')">
            <i slot="icon" v-if="this.notes" class="fa fa-newspaper-o fa-no"></i>
            <i slot="icon" v-if="!this.notes" class="fa fa-newspaper-o "></i>
          </grid-item>
          <!-- 领物通知 -->
          <!-- <grid-item :link="{ path: './fqa'}" :label=" $t('message.guide')"> -->
          <grid-item :label=" $t('index.guide')" @click.native="showNoOpen('领物通知')">
            <i slot="icon" v-if="package" class="fa fa-smile-o fa-no"></i>
            <i slot="icon" v-if="!package" class="fa fa-smile-o "></i>
          </grid-item>
          <!-- 比赛路线 -->
          <!-- <grid-item :link="{ path: './refund'}" :label=" $t('message.routeline')"> -->
          <grid-item :label=" $t('index.routeline')" @click.native="showNoOpen('比赛路线')">
            <i slot="icon" v-if="map" class="fa fa-map-o fa-no"></i>
            <i slot="icon" v-if="!map" class="fa fa-map-o "></i>
          </grid-item>
          <!-- 使用帮助 -->
          <grid-item @click.native="gogogo()" :label=" $t('index.website')">
            <i slot="icon" class="fa fa-desktop "></i>
          </grid-item>

          <!-- style="width:100%;height:100%;background-color:red" -->

          <!-- 以下暂无展示 -->

          <!-- 退款须知 -->
          <!-- <grid-item :link="{ path: './refund'}" :label=" $t('message.refund')">
          <i slot="icon" class="fa fa-credit-card "></i>
        </grid-item> -->
          <!-- 分区查询 -->
          <!-- <grid-item :link="{ path: './subarea'}" :label=" $t('message.query')">
          <i slot="icon" class="fa fa-map-signs "></i>
        </grid-item> -->
          <!-- 常见问题 -->
          <!-- <grid-item link="./fqa" :label=" $t('message.fqa')">
          <i slot="icon" class="fa fa-question-circle-o "></i>
        </grid-item> -->

        </grid>
      </div>
      <actionsheet v-model="cn" :menus="menus1" @on-click-menu="clickActionBib">
        <p slot="header" v-html="$t('index.bib')"></p>
      </actionsheet>

      <actionsheet v-model="ce" :menus="menus2" @on-click-menu="clickActionPro">
        <p slot="header" v-html="$t('index.project')"></p>
      </actionsheet>

      <div v-transfer-dom>
        <confirm v-model="showMore" title="身份校验" @on-confirm="indexBind('click')">

          <x-input placeholder="请填写验证码" v-model="code" class="weui-vcode">
            <x-button :disabled='clock' slot="right" type="primary" @click.native="countDown" mini>{{codeMessage}}
            </x-button>
          </x-input>

          <p style="text-align: left;font-size:12px;line-height:1.5">仅选手本人可以执行该操作，点击“发送验证码”按钮，系统将向您报名时填写的手机号或者邮箱发送验证码，在上边输入框填写您收到的验证码并点击确认按钮继续后边的操作。如非选手本人，请点击取消按钮。</p>

        </confirm>
      </div>

      <div v-if='pageType=="baoming"' class=''>
        <div class="footerBanner">
          <div v-if="ad" class="ad" v-html="ad"></div>
          <img :src="imgSrc" alt="">
        </div>
        <div id="tabbar" class='needsclick'>
          <div class="button_header" id='x-bottom'>
            <x-header class="fixBottomButton" slot="header" style="width: 100%;position: fixed;bottom: 0px;z-index: 100;max-width: 850px;margin: 0 auto;" title="立即报名" @on-click-title='popup'>
              <div slot="overwrite-left"></div>
              <!-- <x-icon @click.native="showMenu=true" slot="overwrite-left" type="navicon" size="35" style="fill:#fff;position:relative;top:-8px;left:-3px;"></x-icon> -->

            </x-header>
            <actionsheet @on-click-menu='menuClick' v-model="showMenu" :menus="menus"></actionsheet>
          </div>
        </div>
      </div>

      <div>
        <div v-if='pageType!="baoming"' id="tabbar">
          <tabbar style="position: fixed;max-width: 850px;">
            <tabbar-item link="/racelist">

              <span slot="label">赛事</span>
            </tabbar-item>
            <!-- <tabbar-item link="/newlist">

              <span slot="label">新闻</span>
            </tabbar-item> -->
            <tabbar-item link="/user">

              <span slot="label">个人</span>
            </tabbar-item>

          </tabbar>
        </div>
      </div>

      <!-- <group v-if='isShowEvent' ref='pop' class='needsclick'>
      <popup-radio style="display:none" @on-hide='next2' class='needsclick' title="11" :options="options3" v-model="option5">
        <template slot-scope="props" slot="each-item">
          
          <p class="clearfix">
            <span style="color:#666;"> {{ eventList[props.index].name}}</span>
            <span style="float:right;position: relative;top: 11px;">¥{{ eventList[props.index].rate}} </span>
            <br>
            <span>{{getState(eventList[props.index])}}</span>
          </p>
        </template>
      </popup-radio>
    </group> -->
    </view-box>
  </div>

</template>


<script type="text/ecmascript-6">
/* eslint-disable*/
const countTime = 60; //倒数计时60秒

const STARTSTR = "进行中"; //进行中提示
const ENDSTR = "已经结束"; //结束提示
const UNSTARTSTR = "尚未开始"; //尚未开始提示
import mixin from "@/common/js/mixin.js";

import Myheader from "@/common/components/myheader.vue";
import Myfooter from "@/common/components/myfooter1.vue";
import { cookie } from "vux";
import Indexlist from "@/common/components/indexlist.vue";
import Signedlist from "@/common/components/signedlist.vue";
import ShowMessage from "@/common/components/show_message.vue";

import {
  ViewBox,
  XHeader,
  Card,
  PopupRadio,
  Radio,
  Tabbar,
  TabbarItem,
  debounce,
  XInput,
  Group,
  XButton,
  Grid,
  GridItem,
  FormPreview,
  Cell,
  LoadMore,
  Actionsheet,
  Toast,
  Confirm,
  TransferDomDirective as TransferDom
} from "vux";
//axios
import qs from "qs";
import { axios } from "@/api/axios.js";
import { indexedDB } from "@/api/indexedDB.js";

import {
  isIdNumber,
  dateStringToDateTime,
  timeFormat,
  startTime,
  setTitle
} from "@/common/js/main.js";

export default {
  props: ["page", "host"],
  data() {
    return {
      isShowScores: true,
      indexList: [],
      info: {},
      options3: [],
      option5: "",
      ad: "",
      imgSrc: "",
      isShowEvent: false,
      // key: "wuximarathon",
      // 显示状态
      indexStatus: 0,
      // 证件号
      indexNumber: "",
      raceId: 0,
      name: "",
      //列表显示的参赛号
      bib: "",
      project: "",
      mydata: {},
      gender: "",
      cn: false,
      ce: false,
      type: [],
      items: [],
      // 参赛号数组
      competingnos: [],
      menus1: {},
      menus2: {},
      buttonFlag: true,
      showToast: true,
      showPositionValue: false,
      wrongMsg: "",
      enen: [],
      //raceid的赛事信息
      raceData: [],
      keyValue: [],
      rule: true,
      map: true,
      disclaimer: true,
      notes: true,
      package: true,
      noOpenMessage: false,
      tag: true,
      ruleid: "",
      mapid: "",
      disclaimerid: "",
      notesid: "",
      packageid: "",
      procedureid: "",
      codeMessage: "发送验证码",
      clock: false,
      code: "",
      state: "",
      stateMessage: "",
      showMore: false,
      mysid: ""
    };
  },
  computed: {},
  created() {
    //console.log(!!this.$route.query._from)
    //window.localStorage.setItem("pageType", "baoming");
    //泰山马拉松
    //cookie.remove('_sid')
    //

    //console.log(this.$route.query.race_id);

    if (!!this.$route.query.race_id) {
      this.raceId = this.$route.query.race_id;
    } else {
      this.raceId = this.page.raceid;
    }

    this.isShowScores = true;

    //console.log(this.pageType);

    window.localStorage.setItem("message", "old");

    if (cookie.get("_sid")) {
      this.mysid = cookie.get("_sid");
    }

    if (cookie.get("idnum")) {
      this.indexNumber = cookie.get("idnum");
    }

    this.timeDate = new Date().valueOf();

    window.localStorage.setItem("raceId", this.raceId);
    //获取indexedDB存在的数据warnMessage
    indexedDB(
      "warnMessage",
      "get",
      this.RACEID,
      "",
      function(a) {
        this.wrongMsg = a;
        if (this.wrongMsg && this.wrongMsg !== "") {
          this.$vux.toast.show({
            text: this.wrongMsg,
            type: "warn"
          });
          indexedDB("warnMessage", "set", this.RACEID, "", function() {});
        }
      }.bind(this)
    );

    //获取赛事信息
    getEventlist();
    //this.raceInfo();

    //获取indexedDB存在的数据IDNumber,有进行绑定
    //console.log(cookie)
    //console.log(cookie.get('_sid'))

    indexedDB(
      "IDNumber",
      "get",
      this.RACEID,
      "",
      function(a) {
        this.myId = a;
        if (cookie.get("idnum")) {
          this.indexNumber = cookie.get("idnum");
          this.indexStatus = 1;
          this.search();
        } else if (this.myId && this.myId !== "") {
          this.indexNumber = this.myId;
          //this.indexStatus = 1;
          // this.indexBind1();
        } else {
          this.indexNumber = this.myId;
        }
      }.bind(this)
    );
  },
  mounted() {},
  methods: {
    getMessgae(key) {
      let _this = this;
      return axios.get(`${window.host}registration/show?id=${key}`);
    },
    getState(a) {
      let startDate = dateStringToDateTime(a.reg_begin) || null;
      let endDate = dateStringToDateTime(a.reg_end) || null;
      if (!!a.reg_begin) {
        var startTime = timeFormat(a.reg_begin);
      }

      if (!!a.reg_end) {
        var endTime = timeFormat(a.reg_end) || null;
      }

      if (
        typeof this.inviteCode !== "undefined" &&
        this.inviteEventId == a.id
      ) {
        return "报名中(正在使用邀请码报名)";
      }

      if (!a.reg_begin && !a.reg_end) {
        //没有开始时间 没有结束时间  不设置限制
        if (a.state == "audit") {
          return STARTSTR + "，需要审核";
        } else if (a.state == "draw") {
          return STARTSTR + "，需要抽签";
        } else if (a.state == "normal") {
          if (a.remain <= 0) {
            if (a.allow_wait == 0) {
              return "已经报满了";
            } else if (a.allow_wait >= 1) {
              return "候补中，有 " + a.wait_count + " 人在候补";
            }
          } else {
            return STARTSTR;
          }
        }

        return STARTSTR;
      } else if (!a.reg_begin && a.reg_end) {
        //只有结束时间
        if (this.timeDate >= endDate) {
          //大于结束时间 返回已经结束
          return ENDSTR + "(报名截止时间:" + endTime + ")";
        } else {
          //小于结束时间 返回进行中
          if (a.state == "audit") {
            return STARTSTR + "，需要审核";
          } else if (a.state == "draw") {
            return STARTSTR + "，需要抽签";
          } else if (a.state == "normal") {
            if (a.remain <= 0) {
              if (a.allow_wait == 0) {
                return "已经报满了";
              } else if (a.allow_wait >= 1) {
                return "候补中，有 " + a.wait_count + " 人在候补";
              }
            } else {
              return STARTSTR;
            }
          }

          return STARTSTR;
        }
      } else if (a.reg_begin && !a.reg_end) {
        //只有开始时间
        if (this.timeDate >= startDate) {
          //大于开始时间 返回进行中
          if (a.state == "audit") {
            return "报名中，需要审核";
          } else if (a.state == "draw") {
            return "报名中，需要抽签";
          } else if (a.state == "normal") {
            if (a.remain <= 0) {
              if (a.allow_wait == 0) {
                return "已经报满了";
              } else if (a.allow_wait >= 1) {
                return "候补中，有 " + a.wait_count + " 人在候补";
              }
            } else {
              return STARTSTR;
            }
          }

          return STARTSTR;
        } else {
          //小于开始时间 返回还未开始
          return UNSTARTSTR + "(开始时间:" + startTime + ")";
        }
      } else if (a.reg_begin && a.reg_end) {
        //正常状态，有开始和结束时间
        // if (this.timeDate >= endDate) {
        //   return ENDSTR;
        // } else if (this.timeDate <= startDate) {
        //   return UNSTARTSTR;
        // }
        // return STARTSTR
        //只有开始时间
        //console.log(this.timeDate);
        if (this.timeDate <= startDate) {
          //当前时间小于开始时间 还没开始
          return UNSTARTSTR + "(开始时间:" + startTime + ")";
        } else if (this.timeDate >= endDate) {
          //当前时间大于结束事时间 已经结束
          return ENDSTR + "(截止时间:" + endTime + ")";
        } else {
          if (a.state == "audit") {
            return STARTSTR + "，需要审核";
          } else if (a.state == "draw") {
            return STARTSTR + "，需要抽签";
          } else if (a.state == "normal") {
            if (a.remain <= 0) {
              if (a.allow_wait == 0) {
                return "已经报满了";
              } else if (a.allow_wait >= 1) {
                return "候补中，有 " + a.wait_count + " 人在候补";
              }
            } else {
              return STARTSTR;
            }
          }
          return STARTSTR;
        }
      }
    },
    next2() {
      //关闭弹出列表 如果有选中的值就跳转
      if (!!this.option5) {
        //console.log(this.option5)
        //console.log(this.info)
        window.localStorage.setItem("isTeam", "fasle");
        this.eventList.forEach((item, inddex) => {
          if (item.id == this.option5) {
            if (item.team == 1) {
              window.localStorage.setItem("isTeam", "true");
            } else {
              window.localStorage.setItem("isTeam", "false");
            }
          }
        });

        window.localStorage.setItem("eventId", this.option5);
        window.localStorage.setItem("raceId", this.raceId);
        window.localStorage.setItem("disclaimerID", this.info.disclaimer);
        if (!!this.info.disclaimer) {
          this.$router.push({ path: "disclaimer" });
        } else {
          //如果是团队报名
          if (window.localStorage.getItem("isTeam") == "true") {
            this.$router.push({ path: "teamlist" });
          } else {
            this.$router.push({ path: "certificate/identity" });
          }
        }

        // if (!!this.info.disclaimer) {
        //   //如果有就跳免责申明
        //   window.localStorage.setItem("eventId", this.option5);
        //   this.$router.push({ path: "disclaimer" });
        // } else {
        //   //如果没有就跳填身份
        //   this.$router.push({ path: "disclaimer" });
        // }
      }
    },
    getEventlist() {
      var _this = this;

      this.axios
        .post(
          `${host}race/events`,
          qs.stringify({
            raceid: this.raceId
          })
        )
        .then(response => {
          if (response.data.code == "200") {
            this.eventList = response.data.data;
            //如果邀请码项目在报名的赛事中 可通过
            let startLength = 0;
            let endLength = 0;

            //console.log(this.eventList);

            for (let i = 0; i < response.data.data.length; i++) {
              response.data.data[i].rate = response.data.data[i].price >> 0;
              this.options3.push(response.data.data[i].id);
              if (
                window.localStorage.getItem("invitationEventId") &&
                window.localStorage.getItem("invitationEventId") ==
                  response.data.data[i].id
              ) {
                this.isDisabled = false;
                this.msg = "正在使用邀请码报名";
                break;
              }
              let timeDate = new Date().valueOf();
              let startDate =
                dateStringToDateTime(response.data.data[i].reg_begin) || null;
              let endDate =
                dateStringToDateTime(response.data.data[i].reg_end) || null;
              if (!!startDate && timeDate < startDate) {
                //还没开始
                startLength++;
              } else if (!!endDate && timeDate > endDate) {
                //已经结束
                endLength++;
              }
            }

            if (startLength == response.data.data.length) {
              this.msg = "报名未开始";
              this.isDisabled = true;
            } else if (endLength == response.data.data.length) {
              this.msg = "报名结束";
              this.isDisabled = true;
            } else {
              this.msg = "报名中";
              this.isDisabled = false;
            }

            this.isShowEvent = true;

            setTimeout(() => {
              let array = document.querySelectorAll(
                ".weui-cells_radio .weui-check__label"
              );
              _this.eventList.map((item, index) => {
                //console.log(item);
                //判断哪些事不能报名的
                //console.log(index)
                //console.log(item.key)
                //console.log(_this.inviteEventId)

                if (
                  //!item.reg_able
                  !item.reg_able &&
                  item.key != _this.inviteEventId
                ) {
                  //不能报名
                  array[index].className =
                    "weui-cell weui-cell_radio weui-check__label disable";
                } else if (!item.reg_able) {
                  array[index].className =
                    "weui-cell weui-cell_radio weui-check__label disable";
                }
              });
            }, 0);

            //console.warn(this.eventList)

            //console.log(this.msg);

            // response.data.data.map((item, index) => {
            //   if(window.localStorage.getItem('invitationEventId')&&window.localStorage.getItem('invitationEventId')==item.id){
            //       isDisabled=false
            //       return
            //   }
            //   if(!isDisabled){

            //   }
            //console.log(item.id)
            // //如果有一个项目不可报名
            // if (!item.reg_able) {
            //   this.isDisabled = true;
            //   return;
            // }
            // this.isDisabled = false;
            //  });
            //console.log(response.data.data)
            //response.data.data;
          }
        });
    },
    popup() {
      this.$router.push({
        path: `/list`
      });
      //console.log(this)
      //console.log(this.$refs.pop)
      //this.$refs.pop.$children[0].$el.click();
      //this.$refs.pop.$children[0].$el.click();
    },
    more() {
      //console.log(cookie.get('sid'))
      if (cookie.get("sid")) {
        this.$router.push({
          path: `/message?race_id=${this.raceId}`
        });
      } else {
        this.showMore = !this.showMore;
      }
    },
    search() {
      let _this = this;

      this.axios
        .post(
          `${window.host}registration/query`,
          qs.stringify({
            raceid: this.raceId,
            idnum: this.indexNumber || cookie.get("idnum")
          })
        )
        .then(response => {
          if (response.data.code == "200") {
            //this.indexNumber=''
            cookie.set("idnum", this.indexNumber);
            //没有查到数据
            if (response.data.data.length == 0) {
              this.$vux.toast.show({
                text: this.$t("index.nofound"),
                type: "warn"
              });
              this.indexList = [];

              //删除indexedDB数据IDNumber,
              indexedDB(
                "IDNumber",
                "remove",
                this.RACEID,
                "",
                function(a) {
                  this.indexStatus = 0;
                  this.indexNumber = "";
                }.bind(this)
              );
              return false;
            }
            //用id+赛事id获取到key然后在用key去获取信息
            //console.log(response.data.data);
            var array = [];
            response.data.data.forEach((item, index) => {
              //console.log(item._key);
              array.push(this.getMessgae(item._key));
              //console.log(item);
            });
            _this.indexList = [];
            this.axios.all(array).then(
              this.axios.spread(function() {
                for (var i = 0; i < arguments.length; i++) {
                  console.log(arguments);
                  if (arguments[i].data.code == 200) {
                    console.log(arguments[i].data.data);
                    //_this.$set('indexList',[i],arguments[i].data.data)
                    _this.indexList.push(arguments[i].data.data);
                    //console.log('--')
                    //console.log(_this.indexList);
                  }
                }
              })
            );

            //this.name = response.data.data[0].name;

            //this.indexStatus = 1;

            //this.indexList = response.data.data;

            // if (response.data.data[0].bib == "") {
            //   this.bib = "参赛号未分配";
            // } else {
            //   this.bib = response.data.data[0].bib;
            // }

            // this.project = response.data.data[0].event.name;
            // //状态
            // if (!!response.data.data[0].refundid) {
            //   var message = "有退款";
            //   this.stateMessage = message;
            //   return;
            // } else if (!!response.data.data[0].pay_at) {
            //   var message = "/已支付";
            // } else {
            //   var message = "/未支付";
            // }

            // if (
            //   response.data.data[0].state === "normal" &&
            //   !!response.data.data[0].pay_at
            // ) {
            //   this.stateMessage = "报名成功/已支付";
            // } else if (response.data.data[0].state === "normal") {
            //   this.stateMessage = "报名正常" + message;
            // } else if (response.data.data[0].state === "waitfail") {
            //   this.stateMessage = `候补结束，未获得名额`;
            // } else if (response.data.data[0].state === "wait") {
            //   if (!!response.data.data.pos) {
            //     //候补 有post人数
            //     this.stateMessage =
            //       `候补中,前边有${response.data.data[0].pos}人` + message;
            //   } else {
            //   //候补 没有post人数
            //     this.stateMessage = `候补中` + message;
            //   }
            // } else if (response.data.data[0].state == "draw") {
            //   this.stateMessage = `等待抽签`;
            // } else if (response.data.data[0].state === "undraw") {
            //   if (!!response.data.data[0].wait_pos) {
            //     this.stateMessage =
            //       `未中签(候补代码${response.data.data[0].wait_pos})` + message;
            //   }
            //   this.stateMessage = `未中签` + message;
            // } else if (response.data.data[0].state === "audit") {
            //   this.stateMessage = `审核中` + message;
            // } else if (response.data.data[0].state === "auditfail") {
            //   this.stateMessage =
            //     `审核未通过(${response.data.data[0].refusemsg})` + message;
            // }

            //参赛项目

            //_this.type.push(response.data.data.name);
          } else {
            this.indexList = [];
            this.$vux.toast.show({
              text: "未查询到选手资料",
              type: "cancel"
            });
          }
        });
    },
    countDown() {
      if (this.clock) {
        return;
      }
      if (this.indexNumber == "") {
        return;
      }
      this.sendCode();
      this.clock = true;
      let _this = this;
      this.codeMessage = countTime;
      let countDown = setInterval(function() {
        //console.log(_this.codeMessage)
        if (_this.codeMessage <= 1) {
          _this.codeMessage = "发送验证码";
          _this.clock = false;
          clearInterval(countDown);
          return;
        }
        _this.codeMessage--;
      }, 1000);
    },
    gogogo() {
      location.href = "/#/list";
    },
    sendCode() {
      this.axios
        .post(
          `${window.host}registration/bind`,
          qs.stringify({
            raceid: this.raceId,
            idnum: this.indexNumber
          })
        )
        .then(response => {
          if (response.data.code == "200") {
            this.$vux.toast.show({
              text: "短信发送成功"
            });
          } else {
            this.$vux.toast.show({
              text: response.data.msg,
              type: "cancel"
            });
          }
        });
    },
    showNoOpen: function(item) {
      var num = event.target.children[0].children[0].className;
      if (num.indexOf("fa-no") === -1) {
        this.noOpenMessage = false;
        if (item == "我的报名") {
          this.$router.push({
            path: "/list"
          });
        }
        if (item == "我的照片") {
          this.$router.push({
            path: "/photo"
          });
        }
        if (item == "我的成绩") {
          this.$router.push({
            path: "/report"
          });
        }

        if (item == "竞赛规程") {
          this.$router.push({
            path: "/procedure",
            query: { id: this.ruleid }
          });
        } else if (item == "报名须知") {
          this.$router.push({
            path: "/procedure",
            query: { id: this.notesid }
          });
        } else if (item == "领物通知") {
          this.$router.push({
            path: "/procedure",
            query: { id: this.packageid }
          });
          // console.log(33);
        } else if (item == "比赛路线") {
          this.$router.push({
            path: "/procedure",
            query: { id: this.mapid }
          });
        }
      } else {
        this.noOpenMessage = true;
      }
    },

    // 查询赛事信息列表
    raceInfo: function() {
      let that = this;

      this.axios
        .post(
          `${window.host}race/show`,
          qs.stringify({
            raceid: this.raceId
          })
        )
        .then(response => {
          that.raceData = response.data.data;
          this.info = response.data.data;
          (that.ruleid = that.raceData.rule),
            (that.mapid = that.raceData.map),
            (that.disclaimerid = that.raceData.disclaimer),
            (that.notesid = that.raceData.notes),
            (that.packageid = that.raceData.package),
            //写入indexedDB数据disclaimer,
            (this.ad = this.raceData.ad);
          this.imgSrc = this.raceData.imgSrc;
          window.localStorage.setItem("project", that.raceData.name);
          setTitle(response.data.data.name);
          //console.warn(this.raceData)

          //获取项目列表
          this.getEventlist();

          indexedDB(
            "disclaimer",
            "set",
            this.RACEID,
            this.raceData.disclaimer,
            function() {}
          );

          for (var key in that.raceData) {
            var value = key;
            that.keyValue.push(value);
          }

          Array.prototype.in_array = function(element) {
            for (var i = 0; i < this.length; i++) {
              if (this[i] == element) {
                return 1;
              }
            }
            return -1;
          };
          if (that.keyValue.in_array("rule") !== -1 && that.raceData["rule"]) {
            this.rule = false; //置灰
          }
          if (that.keyValue.in_array("map") !== -1 && that.raceData["map"]) {
            this.map = false;
          }
          if (
            that.keyValue.in_array("disclaimer") !== -1 &&
            that.raceData["disclaimer"]
          ) {
            this.disclaimer == false;
          }
          if (
            that.keyValue.in_array("notes") !== -1 &&
            that.raceData["notes"]
          ) {
            this.notes = false;
          }
          if (
            that.keyValue.in_array("package") !== -1 &&
            that.raceData["package"]
          ) {
            this.package = false;
          }
        });
    },
    clickActionPro() {},
    //跳转路由
    goRouter(path) {
      if (this.indexStatus == 0) {
        this.$vux.toast.show({
          text: this.$t("index.bandfirst"),
          type: "warn"
        });
      } else {
        cookie.set("idnum");
        this.$router.push(`/${path}`);
      }
    },
    indexBind1: function(a) {
      let _this = this;
      this.axios
        .post(
          `${window.host}registration/fetch`,
          qs.stringify({
            idnum: this.indexNumber,
            raceid: this.raceId
          })
        )
        .then(response => {
          if (response.data.code === "200") {
            if (response.data.data.length == 0) {
              this.$vux.toast.show({
                text: this.$t("index.nofound"),
                type: "warn"
              });
              //删除indexedDB数据IDNumber,
              indexedDB(
                "IDNumber",
                "remove",
                this.RACEID,
                "",
                function(a) {
                  this.indexStatus = 0;
                  this.indexNumber = "";
                }.bind(this)
              );
              return false;
            }
            // 成功则获取数据,得到一个对象
            this.mydata = response.data.data;
            //console.log(this.mydata)

            // console.log(this.mydata)
            // 项目
            // 获取参赛项目,进行遍历

            //临时跳转
            /*   if (!!a && a == 'click') {
             this.$router.push({
             path: "/message",
             });
             }*/
            //临时跳转结束

            this.axios
              .post(
                `${window.host}race/events`,
                qs.stringify({
                  raceid: this.raceId
                })
              )
              .then(response1 => {
                _this.type = [];
                _this.mydata.forEach(function(item, index) {
                  response1.data.data.forEach(function(item1, index1) {
                    if (item.eventid == item1.id) {
                      _this.type.push(item1.name);
                    }
                  });
                });
                _this.items = _this.type;
                _this.project = _this.items[0];
              });

            _this.mydata.forEach((item, index) => {
              //console.log(item.refundid);

              var payMessage = "";
              var message = "";

              //判断支付状态
              if (!!item.pay_at && !item.refundid) {
                //已支付
                payMessage = "/已支付";
              } else if (!item.pay_at && !!item.refundid) {
                //有退款
                payMessage = "/有退款";
              } else if (!item.pay_at) {
                //未支付
                payMessage = "/未支付";
              }

              //判断报名状态
              if (item.state === "normal" && !!item.pay_at) {
                message = "报名成功";
              }else if(item.state === "normal" && !!item.invite){
                message = "报名成功";
              } else if (item.state === "normal") {
                message = "报名正常";
              } else if (item.state === "waitfail") {
                message = `候补结束，未获得名额`;
              } else if (item.state === "wait") {
                if (!!item.pos) {
                  //候补 有post人数
                  message = `候补中,前边有${item.pos}人`;
                } else {
                  //候补 没有post人数
                  message = `候补中`;
                }
              } else if (item.state == "draw") {
                message = `等待抽签`;
              } else if (item.state === "undraw") {
                message = `未中签`;
              } else if (item.state === "audit") {
                message = `未中签`;
              } else if (item.state === "auditfail") {
                message  = `审核未通过(${item.refusemsg})`
                if(!!item.refusemsg){
                message  = `审核未通过`        
                }
                
              }


              this.stateMessage=message+payMessage



          

              if (!!item.bib) {
                //遍历数据获取每一个参赛号放入competingnos数组中
                _this.competingnos.push(item.bib);
                _this.bib = this.competingnos[0];
              } else {
                //遍历数据获取每一个参赛号放入competingnos数组中
                _this.competingnos.push(item.bib);
                _this.bib = this.competingnos[0];
              }
            });

            this.name = this.mydata[0].name;
            // 证件号
            this.idnum = this.mydata[0].idnum;
            // 性别
            this.gender = "";

            // if (this.gender === "male") {
            //   this.gender = this.$t("index.male");
            // } else if (this.gender === "female") {
            //   this.gender = this.$t("index.female");
            // }

            this.indexStatus = 1;
            //写入indexedDB数据IDNumber,
            indexedDB(
              "IDNumber",
              "set",
              this.RACEID,
              this.idnum,
              function() {}
            );
          } else if (response.data.code === 0) {
            this.wrongMsg = response.data.msg;
            this.showPositionValue = true;
          }
        });
    },
    // 点击请求报名查询接口
    indexBind: function(a) {
      let _this = this;
      this.axios
        .post(
          `${window.host}registration/checkbind`,
          qs.stringify({
            idnum: this.indexNumber,
            raceid: this.raceId,
            code: this.code
          })
        )
        .then(response => {
          if (response.data.code === "200") {
            cookie.set("idnum", this.indexNumber);
            if (response.data.data.length == 0) {
              this.$vux.toast.show({
                text: this.$t("index.nofound"),
                type: "warn"
              });

              //删除indexedDB数据IDNumber,
              indexedDB(
                "IDNumber",
                "remove",
                this.RACEID,
                "",
                function(a) {
                  this.indexStatus = 0;
                  this.indexNumber = "";
                }.bind(this)
              );
              return false;
            }
            // 成功则获取数据,得到一个对象
            this.mydata = response.data.data;

            // console.log(this.mydata)
            // 项目
            // 获取参赛项目,进行遍历

            //临时跳转
            /*   if (!!a && a == 'click') {
             this.$router.push({
             path: "/message",
             });
             }*/
            //临时跳转结束

            // this.axios
            //   .post(
            //     `${window.host}race/events`,
            //     qs.stringify({
            //       raceid: this.raceId
            //     })
            //   )
            //   .then(response1 => {
            //     _this.type = [];
            //     _this.mydata.data.forEach(function(item, index) {
            //       response1.data.data.forEach(function(item1, index1) {
            //         if (item.eventid == item1.id) {
            //           _this.type.push(item1.name);
            //         }
            //       });
            //     });
            //     _this.items = _this.type;
            //     _this.project = _this.items[0];
            //   });

            // _this.mydata.data.forEach((item, index) => {
            //   //遍历数据获取每一个参赛号放入competingnos数组中

            //   if (!!item.refundid) {
            //     var message = "有退款";
            //     this.stateMessage = message;
            //     return;
            //   } else if (!!item.pay_at) {
            //     var message = "/已支付";
            //   } else {
            //     var message = "/未支付";
            //   }

            //   if (item.state === "normal" && !!item.pay_at) {
            //     this.stateMessage = "报名成功/已支付";
            //   } else if (item.state === "normal") {
            //     this.stateMessage = "报名正常" + message;
            //   } else if (item.state === "waitfail") {
            //     this.stateMessage = `候补结束，未获得名额`;
            //   } else if (item.state === "wait") {
            //     if (!!item.pos) {
            //       //候补 有post人数
            //       this.stateMessage = `候补中,前边有${item.pos}人` + message;
            //     } else {
            //       //候补 没有post人数
            //       this.stateMessage = `候补中` + message;
            //     }
            //   } else if (item.state == "draw") {
            //     this.stateMessage = `等待抽签`;
            //   } else if (item.state === "undraw") {
            //     if (!!item.wait_pos) {
            //       this.stateMessage =
            //         `未中签(候补代码${item.wait_pos})` + message;
            //     }
            //     this.stateMessage = `未中签` + message;
            //   } else if (item.state === "audit") {
            //     this.stateMessage = `审核中` + message;
            //   } else if (item.state === "auditfail") {
            //     this.stateMessage = `审核未通过(${item.refusemsg})` + message;
            //   }

            //   if (!!item.bib) {
            //     //遍历数据获取每一个参赛号放入competingnos数组中
            //     _this.competingnos.push(item.bib);
            //     _this.bib = this.competingnos[0];
            //   } else {
            //     //遍历数据获取每一个参赛号放入competingnos数组中
            //     _this.competingnos.push(item.bib);
            //     _this.bib = this.competingnos[0];
            //   }
            // });

            // this.name = this.mydata.data[0].name;

            this._sid = this.mydata._sid;
            if (!!cookie.get("_sid")) {
            } else {
              cookie.set("_sid", response.data.data._sid);
            }
            this.mysid = this.mydata._sid;
            // // 证件号
            // this.idnum = this.mydata.data[0].idnum;
            // // 性别
            // this.gender = this.mydata.data[0].gender;
            // if (this.gender === "male") {
            //   this.gender = this.$t("index.male");
            // } else if (this.gender === "female") {
            //   this.gender = this.$t("index.female");
            // }

            //console.log(this._sid)

            //console.log(this.idnum)
            //this.indexStatus = 1;

            //写入indexedDB数据IDNumber,
            indexedDB(
              "IDNumber",
              "set",
              this.RACEID,
              this.indexNumber,
              function() {
                indexedDB("_sid", "set", _this.RACEID, _this._sid, function() {
                  cookie.set("_sid", _this._sid);

                  _this.$router.push({
                    path: `/message?race_id=${_this.raceId}`
                  });
                });
              }
            );
          } else if (response.data.code === 0) {
            this.wrongMsg = response.data.msg;
            this.showPositionValue = true;
          }
        });
    },
    // 取消绑定
    ButtonCancel: function() {
      //删除indexedDB数据IDNumber,
      cookie.remove("sid");
      cookie.remove("idnum");
      indexedDB(
        "IDNumber",
        "remove",
        this.RACEID,
        "",
        function(a) {
          this.indexStatus = 0;
          this.indexNumber = "";
          this.mysid = "";
          cookie.remove("sid");
        }.bind(this)
      );
    },
    // 继续查询
    ButtonCancel1: function() {
      //删除indexedDB数据IDNumber,
      //cookie.remove("sid");
      //cookie.remove("idnum")
      indexedDB(
        "IDNumber",
        "remove",
        this.RACEID,
        "",
        function(a) {
          this.indexStatus = 0;
          this.indexNumber = "";
          this.mysid = "";
          cookie.remove("sid");
        }.bind(this)
      );
    },
    //参赛号的弹框列表
    competingNo: function() {
      // this.competingnos=["1","2"]
      // console.log(this.competingnos);
      this.cn = true;
      for (var i = 0; i < this.competingnos.length; i++) {
        this.menus1[i] = this.competingnos[i];
      }
    },
    //参赛项目弹框列表
    competitionEvents: function() {
      this.ce = true;
      //console.log('---')
      //console.log(this.items)
      for (var i = 0; i < this.items.length; i++) {
        this.menus2[i] = this.items[i];
      }
    },

    // 点击弹窗数据，替换列表数据
    clickActionBib(key, item) {
      this.bib = item;
    },
    clickActionPro(key, item) {
      this.project = item;
      //console.log(this.mydata[key].eventid)
      this.$router.push({
        path: "/message",
        query: { eventid: this.mydata[key].eventid }
      });
    },

    isIdNumber: function(value) {
      this.buttonFlag = !isIdNumber(value) && this.code != "";
      return {
        valid: isIdNumber(value),
        msg: "请输入正确的证件号"
      };
    }
  },
  directives: {
    TransferDom
  },
  components: {
    ViewBox,
    Signedlist,
    XHeader,
    Indexlist,
    Card,
    PopupRadio,
    Radio,
    Tabbar,
    TabbarItem,
    debounce,
    XInput,
    Group,
    XButton,
    Grid,
    GridItem,
    FormPreview,
    Cell,
    LoadMore,
    Actionsheet,
    Toast,
    Myheader,
    Confirm,
    ShowMessage
  },
  mixins: [mixin]
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" rel="stylesheet/less">
html,
body {
  height: 100%;
  width: 100%;
}

#vux_view_box_body {
  background: #fbf9fe;
}

#query #type_baoming {
  background: #fbf9fe;
}

//隐藏九宫格
.query-bottom {
  display: none;
}

#query .index-topf h2 {
  color: #26a2ff;
}

#query {
  h2 {
    font-size: 30px;
    margin: 30px 0 30px 10px;
    text-align: center;
    color: #26a2ff;
    margin-top: 0;
  }
  // 去除group的margintop
  .top-group {
    width: 100%;
  }
  .index-topf {
    padding-top: 30px;
    position: relative;
    z-index: 99;
    background: #fbf9fe;
    .tips {
      padding: 10px 15px;
    }
  }
  .index-bottom {
    height: 60%;
    margin-bottom: 100px;
    // 图标颜色
    .fa {
      color: #3cc51f;
      font-size: 28px;
    }
    .fa-no {
      color: #ddd;
      font-size: 28px;
    }
    .weui-grid__icon {
      margin-bottom: 10px;
      pointer-events: none;
    }
    .weui-grid__label {
      pointer-events: none;
    }
  }
  // 详情页
  .index-tops {
    // margin: 30px 0 30px 0;
    // margin-top: 0;
    // padding-top: 30px;
    .gridbox {
      border-bottom: 1px solid #d9d9d9;
      .weui-grid:after {
        border: none;
      }
    }
    .cancel-button {
      margin-top: 15px;
      display: flex;
    }
    .grid-center {
      display: block;
      text-align: center;
      color: #666;
    }
    .gridbox {
      .weui-grid:before {
        border-right: none;
      }
    }
    // 去除选手信息列表的线
    .weui-loadmore_line .weui-loadmore__tips {
      padding: 0;
    }
  }
}

#query .index-bottom .unactive {
  color: #ddd;
}

#query .index-bottom .unactive1 .weui-grid__label {
  color: #000;
}

#query + div .ad {
  display: block;
}

.vux-x-dialog .vux-x-input input {
  border: 1px solid #ccc;
  width: 110px;
}

#app .footerBanner {
  position: static;
}

#app .footerBanner {
  display: block;
}

#app #query .index-bottom {
  margin-bottom: 0px;
}

#app .weui-tabbar .weui-tabbar__label {
  font-size: 17px;
}

#query h2 {
  font-size: 30px;
  margin: 30px 0 30px 10px;
  text-align: center;
  color: #26a2ff;
  margin-top: 0;
}

.disable {
  pointer-events: none;
}

.card-demo-flex {
  display: flex;
}
.card-demo-content01 {
  padding: 10px 0;
}
// .card-padding {
//   padding: 15px;
// }
.card-demo-flex > div {
  flex: 1;
  text-align: center;
  font-size: 12px;
}

#query .index-tops {
  padding-top: 0px;
  margin-bottom: 50px;
}

#query .card-padding{
     padding: 0px;
}
</style>






